<template>
    <div class="myhome">
        <div class="login">
            <div class="login-img"><img src="static/x/x1.jpg" alt=""></div>
            <span>唐伯点石榴</span>
        </div>
        <nav class="login-nav mui-bar mui-bar-tab">  
            <a class="mui-tab-item mui-active">  
                <span class="mui-icon iconfont icon-qianbao"></span>  
                <span class="mui-tab-label">待付款</span>  
            </a>  
            <a class="mui-tab-item">  
                <span class="mui-icon iconfont icon-wuliuxiaocheche"></span>  
                <span class="mui-tab-label">待发货</span>  
            </a>  
            <a class="mui-tab-item">  
                <span class="mui-icon iconfont icon-shijian"></span>  
                <span class="mui-tab-label">待收货</span>  
            </a>  
            <a class="mui-tab-item">  
                <span class="mui-icon iconfont icon-duihua"></span>  
                <span class="mui-tab-label">待评价</span>  
            </a>
            <a class="mui-tab-item">  
                <span class="mui-icon iconfont icon-qian"></span>  
                <span class="mui-tab-label">退款/退货</span>  
            </a> 
        </nav> 
        <ul class="login-bott mui-table-view">
			<li class="mui-table-view-cell">
				<a class="mui-navigate-right">全部订单</a>
			</li>
			<li class="mui-table-view-cell">
			    <a class="mui-navigate-right">我的收藏</a>
			</li>
            <li class="mui-table-view-cell">
                <a class="mui-navigate-right">浏览记录</a>
			</li>
			<li class="mui-table-view-cell">
                <a class="mui-navigate-right">我的优惠劵</a>
			</li>
            <li class="mui-table-view-cell">
                <router-link class="mui-navigate-right" to="/myhome/site">地址管理</router-link>
			</li>
            <li class="mui-table-view-cell">
                <a class="mui-navigate-right">设置</a>
			</li>
		</ul>
		<ul class="mui-table-view" style="margin-top: 70px;">
			<li class="mui-table-view-cell">
				<a style="text-align: center;color: #FF3B30;">退出登录</a>
			</li>
		</ul>
    </div>
</template>

<script>
export default {
    name: "myhome",
    data() {
        return{

        }
    }
}
</script>

<style scoped>
    .myhome{
        width: 100%;
        height: 100%;
    }
    .myhome .login{
        width: 100%;
        height: 100px;
        background-color: #ffffff;
    }
    .myhome .login .login-img{
        width: 60px;
        height: 60px;
        display: inline-block;
        border-radius: 50px;
        background-color: black;
        overflow: hidden;
        margin-top: 17px;
        margin-left: 50px;
        border: 1px solid rgb(129, 129, 129)
        }
    .myhome .login .login-img img{
        width: 100%;
        height: 100%;
    }
    .myhome .login span{
        float: right;
        line-height: 100px;
        margin-right: 44%;
    }
    .login-nav{
        top: 140px !important;
        background-color: #ffffff;
    }
    .login-nav a{
        height: 70px;
    }
    .login-nav a span:nth-child(2){
        margin-top: 7px;
        font-size: 14px !important;
        font-weight: 200;
        color: black;
    }
    .login-bott{
        top: 70px;
    }
    .login-bott li{
        height: 50px;
        line-height: 30px;
    }
</style>
